<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>{% block title %}{% endblock %}</title>
	<link rel="icon" href="{{ url_for("static", filename="images/logo/logo.png") }}">
	<style>
		body {
			font-size: 16px;
		}

		h1, h2, h3, h4, h5, h6 {
			max-width: 640px;
			margin: auto;
			text-align: center;
		}

		h1 {
			font-size: 2em;
			font-weight: 500;
			padding: 2rem 0 1rem;
		}

		h2 {
			font-size: 1.8em;
			font-weight: 400;
		}

		h3 {
			font-size: 1.5em;
			font-weight: 300;
		}

		ul {
			list-style: none;
			padding: 0;
			margin: 0;
		}

		a {
			color: #0F769F;
			text-decoration: none;
		}

		a:hover {
			text-decoration: underline;
		}

		a:hover {
			color: #3cb8f0;
		}

		section {
			font-size: 16px;
			font-family: 'Lantinghei SC', 'Open Sans', 'Arial', 'Hiragino Sans GB', 'Microsoft YaHei', '\\5FAE\8F6F\96C5\9ED1, STHeiti, WenQuanYi Micro Hei', 'SimSun', 'sans-serif';
			line-height: 1.6;
			color: #333;
			outline: none;
			word-wrap: break-word;
		}

		p {
			word-wrap: break-word;
			margin: 0 0 24px 0;
			color: #333;
			line-height: 2;
		}

		pre {
			padding: 10px 5px 10px 10px;
			margin: 15px 0;
			display: block;
			line-height: 18px;
			background: #F0F0F0;
			border-radius: 3px;
			font-size: 13px;
			font-family: 'monaco', 'Consolas', "Liberation Mono", Courier, monospace;
			white-space: pre;
			word-wrap: normal;
			overflow-x: auto;
		}

		img {
			max-width: 100%;
		}

		#content {
			max-width: 640px;
			margin: 2rem auto;
		}
	</style>
</head>
<body>
<div id="topbar">
	{% block topbar %}{% endblock %}
</div>
<h1>
	{% block head %}
		{{ article.title }}
	{% endblock %}
</h1>
<section id="content">
	{% block content %}
		{{ article.content|safe }}
	{% endblock %}
</section>

</body>
</html>